<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>高德静态地图API测试</title>
</head>
<body>
    <h1>高德静态地图API测试</h1>
    
    <h2>测试你的API Key权限</h2>
    <p>请将下面URL中的 <code>YOUR_API_KEY</code> 替换为你的实际API Key，然后在浏览器中访问：</p>
    
    <h3>1. 基础静态地图测试</h3>
    <div style="background: #f5f5f5; padding: 10px; margin: 10px 0; word-break: break-all;">
        https://restapi.amap.com/v3/staticmap?key=YOUR_API_KEY&location=116.397428,39.90923&zoom=13&size=600*400&scale=2
    </div>
    
    <h3>2. 带标记的静态地图测试</h3>
    <div style="background: #f5f5f5; padding: 10px; margin: 10px 0; word-break: break-all;">
        https://restapi.amap.com/v3/staticmap?key=YOUR_API_KEY&location=116.397428,39.90923&zoom=13&size=600*400&scale=2&markers=116.397428,39.90923
    </div>
    
    <h3>3. 关键字搜索API测试</h3>
    <div style="background: #f5f5f5; padding: 10px; margin: 10px 0; word-break: break-all;">
        https://restapi.amap.com/v3/place/text?key=YOUR_API_KEY&keywords=北京&city=北京&callback=test
    </div>
    
    <h3>4. 逆地理编码API测试</h3>
    <div style="background: #f5f5f5; padding: 10px; margin: 10px 0; word-break: break-all;">
        https://restapi.amap.com/v3/geocode/regeo?key=YOUR_API_KEY&location=116.397428,39.90923&callback=test
    </div>
    
    <h2>测试步骤</h2>
    <ol>
        <li>将上述URL中的 <code>YOUR_API_KEY</code> 替换为你的API Key</li>
        <li>在浏览器中逐个访问这些URL</li>
        <li>检查返回结果：
            <ul>
                <li>静态地图：应该显示地图图片</li>
                <li>API调用：应该返回JSON数据（被callback包装）</li>
                <li>如果返回错误，检查错误信息</li>
            </ul>
        </li>
    </ol>
    
    <h2>常见错误码</h2>
    <ul>
        <li><strong>INVALID_USER_KEY</strong>: API Key无效</li>
        <li><strong>INSUFFICIENT_PRIVILEGES</strong>: 权限不足，没有对应API的调用权限</li>
        <li><strong>DAILY_QUERY_OVER_LIMIT</strong>: 日调用量超限</li>
        <li><strong>ACCESS_TOO_FREQUENT</strong>: 单位时间内请求次数过多</li>
    </ul>
    
    <h2>权限检查</h2>
    <p>确保你的API Key有以下服务的权限：</p>
    <ul>
        <li>✅ 静态地图API</li>
        <li>✅ 关键字搜索API</li>
        <li>✅ 逆地理编码API</li>
        <li>✅ 地理编码API</li>
        <li>✅ 输入提示API</li>
    </ul>
    
    <script>
        function test(data) {
            console.log('API返回数据:', data);
        }
    </script>
</body>
</html>